<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport"
              content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
        <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
        <title>分类</title>
        <link rel="stylesheet" type="text/css" href="../../css/api.css"/>
        <link rel="stylesheet" type="text/css" href="../../css/style.css"/>
        <link rel="stylesheet" type="text/css" href="../../css/yzl.css"/>
        <style>
            .selectActive {
                background-color: #FADDCF !important;
                color: #9d0152;
            }
        </style>
    </head>
    <body>
        <div class="header" id="blank">
            <div v-back.tapmode class="back"></div>
            <span class="title" style="margin-left: 36px;" id="cate_name"></span>
            <img src="../../image/small/search_result_style.png"
                 style="width: 26px; height: 26px;float: right;margin-right: 20px;margin-top: 10px;" id="row"
                 onclick="changeListOf2col(this.id)" tapmode/>
            <img src="../../image/big/search_result_col.png"
                 style="width: 26px; height: 26px;float: right;margin-right: 20px;margin-top: 10px;" id="col"
                 onclick="changeListOf2col(this.id)" tapmode/>
        </div>
        <div id="app">
            <div style="padding-top:62px;width:92%;margin:0 auto"><img :src="activity_pic" style="width:100%;border-radius:8px"></div>
            <div class="home-recommendGoods-box" v-cloak>
              <div class="shop_goods_container" v-if="goodsList">
              <div class="shop_goods_info" v-for="(good,index) in goodsList" v-myclick="[good.goods_id, openGoodsInfo]">
                <img v-image-resize="{src:good.pic}" :key="good.goods_id" width="100%" style="height:160px">
                <div class="goods_name">
                  {{good.title}}
                </div>
                <div class="goods_info_detail">
                  <span>￥{{good.price}}</span>
                  <span style="color:#E5001E;">领券减{{(good.prime-good.price).toFixed(2)}}</span>
                </div>
                <div class="goods_info_detail" style="padding-top:20px;margin-bottom:20px">
                  <span style="font-size:12px">赚&nbsp;{{member_type==6?good.t6_gain_max:good.t5_gain_max}}</span>
                  <span>{{good.sale_count}}人付款</span>
                </div>
              </div>
              <div style="clear:both"></div>
            </div>

            </div>
            <div class="my-order-body" style="padding-top: 30px;" v-cloak v-if="goodsList.length==0">
                <div style="text-align:center;padding: 20px;">
                    <img v-src="'../../image/not_available.png'" width="70px" height="70px"/>
                    <div style="padding-top:10px ">
                        <span>没找到您要的商品</span>
                    </div>
                </div>

            </div>
        </div>


        <script src="../../script/api.js"></script>
        <script src="../../script/vue.js"></script>
        <script src="../../script/app.js"></script>
        <script src="../../script/url.js"></script>
        <script src="../../script/common.js"></script>
        <script src="../../script/components.js"></script>
        <script>
                     var goodsList;
                     var vm;
                     var wx;
                     var member_type;
                     var listOf2col = true;
                     var activity_id;
                     apiready = function () {
                         showProgress();
                         setBSImg();
                         new Vue({
                             el: '#blank'
                         });
                         UIScrollPicture = api.require('UIScrollPicture');
                         MNActionButton = api.require('PIActionButton');
                         wx = api.require('wx');
                         param = api.pageParam;
                         activity_id = param.actid;
                         setBSImg();
                         var data = {
                             member_id: getPrefs('member_id'),
                             activity_id: param.actid
                         };
                         var callback = function (ret) {
                             var activities = ret.content;
                             goodsList = activities.goodsList;
                             activity_pic = activities.activity_pic;
                             activity_name = activities.name;
                             if (getPrefs('token')) {
                               user = JSON.parse(getPrefs('user'));
                               member_type = user.member_type;
                             }
                             document.getElementById("cate_name").innerText = activities.name;
                             initApp();
                             api.parseTapmode();
                         };
                         pinet.post(URL.getActivityCate, data, callback);
                         addListeners();
                     };

                     function initApp() {
                         vm = new Vue({
                             el: "#app",
                             data: {
                                 goodsList: goodsList,
                                 activity_pic: activity_pic,
                                 listOf2col: true,
                                 BSImg: Vue.BSImg,
                                 member_type:member_type,
                                 activity_id:activity_id,
                                 key: 0
                             },
                             methods: {
                                 changeFavor: function (good) {
                                     changeFavor(good);
                                 },
                                 openGoodsInfo: function (goods_id) {
                                     var attributes = {
                                         category_id: activity_id,
                                         goods_id:goods_id
                                     };
                                     onEvent('t001_c001','活动-专题-商品',attributes);
                                     openWin('widget://html/home/goods_info', {goods_id: goods_id,category_id:activity_id,buyeventId:'t001_c001_a001',shareventId:'t001_c001_a002',eventLable:'活动-专题-商品',buyshareeventId:'t001_c001_a003'});
                                 },
                             },
                         })
                     }
                     document.getElementById('row').style.display = 'none';
                     function changeListOf2col(id) {
                         if (id == 'col') {
                             document.getElementById('row').style.display = 'block';
                             document.getElementById('col').style.display = 'none';
                         }
                         if (id == 'row') {
                             document.getElementById('col').style.display = 'block';
                             document.getElementById('row').style.display = 'none';
                         }
                         if (vm.listOf2col) {
                             vm.listOf2col = false;
                         } else {
                             vm.listOf2col = true;
                         }
                     }
                     function addListeners() {
                         api.addEventListener({
                             name: 'viewappear'
                         }, function () {
                             onPageStart();
                         });

                         api.addEventListener({
                             name: 'viewdisappear'
                         }, function (ret, err) {
                             onPageEnd();
                         });

                         api.addEventListener({
                             name: 'keyback'
                         }, function (ret, err) {
                             onPageEnd();
                             api.closeWin();
                         });
                     }
        </script>
    </body>
</html>
